{extend name="../common/my_info"}
{block name="title"}我的信息{/block}
{block name="main"}
<style>
    .coupon_table{
        background: lightskyblue;
        border-radius: 10px;
    }
    .coupon_table th{
        background: lightskyblue;
    }
    table{
        width: 100%;
        border: 1px solid gray;
    }
    th{
        width: 10%;
        color: gray;
        background: whitesmoke;
    }
    td{
        text-align: center;
        border: 1px solid gray;
    }
    li{
        width: 200px;
        display: inline;
        color: #ff623d;
        margin: 5px;
        border-radius: 5px;
        font-size: 18px;
    }
    .a-upload {
        padding: 4px 10px;
        height: 20px;
        line-height: 20px;
        position: relative;
        cursor: pointer;
        color: #888;
        background: #fafafa;
        border: 1px solid #ddd;
        border-radius: 4px;
        overflow: hidden;
        display: inline-block;
        *display: inline;
        *zoom: 1
    }
    .a-upload  input {
        position: absolute;
        font-size: 100px;
        right: 0;
        top: 0;
        opacity: 0;
        filter: alpha(opacity=0);
        cursor: pointer
    }
    .a-upload:hover {
        color: #444;
        background: #eee;
        border-color: #ccc;
        text-decoration: none
    }
    #my_info img{
        width: 200px;
        border-radius: 100px;
    }
    #my_info2 img{
        width: 200px;
        border-radius: 100px;
    }
    #my_order{
        color: gray;
    }
    #my_collage{
        color: gray;
    }
    #my_coupon{
        color: gray;
    }
    #my_evaluate{
        color: gray;
    }
    #my_collect{
        color: gray;
    }
    a{
        text-decoration: none;
        color: gray;
    }
</style>
<div id="div_body" style="width: 100%;height: 100%" align="center">
    <div style="position:relative;width:100%;top:10px;border-radius:20px;background: antiquewhite;">
        <ul>
            <li onmouseover="my_info()" id="info" style="font-size: 30px">我的信息</li>
            <li onmouseover="my_order()" id="order">我的订单</li>
            <li onmouseover="my_coupon()" id="coupon">我的优惠卷</li>
            <li onmouseover="my_evaluate()" id="evaluate">我的评价</li>
            <li onmouseover="my_collect()" id="collect">收藏夹</li>
            <li onmouseover="my_shop_car()" id="shop_car">购物车</li>
        </ul>
        <!--我的信息-->
        <div id="my_info" style="display: block;">
            <br><br><br><br>
            <form action="#" method="post" enctype="multipart/form-data">
                <img src="{$mb_head_img}" width="100px">
                <br>
                <br><br>
                名称：<input class="a-upload" name="mb_name" value="{$mb_name}" readonly><br><br>
                邮箱：<input class="a-upload" name="mb_email" value="{$member['mb_email']}" readonly   ><br><br>
                <a class="a-upload" href="/index/login/mb_update_pwd">修改密码</a>
                <a class="a-upload" style="background: #ff623d;color: white" href="/index/login/out_login">退出登陆</a>
                <a class="a-upload" href="#" onclick="showUp()">修改信息</a><br><br>
            </form>
            <br><br><br><br>
        </div>
        <div id="my_info2" style="display: none;">
            <br><br><br><br>
            <form action="/index/update_info" method="post" enctype="multipart/form-data">
                <img id="upload" src="{$mb_head_img}" width="100px">
                <br>
                <a href="javascript:" class="a-upload">
                    <input name="new_img" id="upload-input" style="position: absolute; top: 0; bottom: 0; left: 0;right: 0; opacity: 0;" type="file" accept="image/gif, image/jpg, image/png" onchange="showImg(this)"/>
                    <!-- 自定义按钮效果 -->
                    <div style="text-align: top">
                        <span style="font-size: 12px;">点击这里更换头像</span>
                    </div>
                </a><br><br>
                名称：<input class="a-upload" name="mb_name" value="{$mb_name}"><br><br>
                <input hidden name="old_img" value="{$mb_head_img}">
                <input hidden name="old_name" value="{$mb_name}">
                <input class="a-upload" style="width: 50px" readonly onclick="info_back()" value="< 返回">
                <input style="height: 30px" value="确认修改" class="a-upload" type="submit" onclick="if (confirm('确认修改信息？')==false)return false;">
            </form>
            <br><br><br><br>
        </div>
        <!--我的订单-->
        <div id="my_order" style="display: none">
            {empty name="order"}
            <div style="width: 70%;height: 567px">
                <br><br><br><br><br><br><br><br><br><br>
                <h1 style="color: gray">您还未在此网站购买过商品</h1>
            </div>
            {else/}
            <div style="width: 70%;height: 567px">
                <table style="font-size: 12px">
                    <tr>
                        <th>订单编号</th>
                        <th>支付时间</th>
                        <th>商品名称</th>
                        <th>订单金额</th>
                        <th>商品件数</th>
                        <th></th>
                    </tr>
                    {for start=0 end=":$o_count"}
                    <tr>
                        <th>{$order[$i]['order_num']}</th>
                        <th>{$order[$i]['pay_time']}</th>
                        <th>
                            <a target="_blank" style="color: gray" href="/index/shop?goods_id={$goods[$i]['id']}">
                                {$goods[$i]['goods_name']}
                            </a>
                        </th>
                        <th>{$order[$i]['order_price']}</th>
                        <th>× {$order[$i]['goods_num']}</th>
                        <th>
                            <a target="_blank" href="/index/shop?goods_id={$goods[$i]['id']}">
                                <img src="{$goods[$i]['goods_img']}" width="80%">
                            </a>
                        </th>
                    </tr>
                    <tr style="height: 30px;">
                        <th><hr></th>
                        <th><hr></th>
                        <th><hr></th>
                        <th><hr></th>
                        <th><hr></th>
                        <th><hr></th>
                    </tr>
                    {/for}
                </table>
            </div>
            {/empty}
        </div>
        <!--我的优惠卷-->
        <div id="my_coupon" style="display: none">
            {empty name="coupon"}
            <div style="width: 70%;height: 567px">
                <br><br><br><br><br><br><br><br><br><br>
                <h1 style="color: gray">您还未有可用的优惠卷</h1>
            </div>
            {else/}
            <div style="width: 70%;height: 567px">
                {foreach $coupon as $c}
                <br>
                <table class="coupon_table" style="height: 120px;width: 90%">
                    <tr>
                        <th></th>
                        <th></th>
                        <th>|</th>
                        <th></th>
                    </tr>
                    <tr>
                        <th width="33%" style="color: green">{$c['mt_name']}</th>
                        <th width="33%">
                            {eq name=":$c['type']" value="0"}
                            立减卷
                            {else/}
                            满减卷
                            {/eq}
                        </th>
                        <th width="1%">|</th>
                        <th width="33%" style="font-size: 24px">× {$c['num']}</th>
                    </tr>
                    <tr>
                        <th><img src="{$c['mt_head_img']}" width="50px" style="border-radius: 100px"></th>
                        <th>{eq name=":$c['type']" value="0"}
                            立减：<p style="display: inline;color: red">{$c['sub']}￥</p>
                            {else/}
                            满：<p style="display: inline;color: red">{$c['full']}￥</p>
                            减：<p style="display: inline;color: red">{$c['sub']}￥</p>
                            {/eq}
                        </th>
                        <th>|</th>
                        <th style="font-size: 12px">
                            有效期至：<br>
                            {eq name=":$c['time']" value="0"}
                            --/--/--
                            {else/}
                            {$c['time']|date="Y-m-d"}
                            {/eq}
                        </th>
                    </tr>
                    <tr>
                        <th>

                        </th>
                        <th></th>
                        <th>|</th>
                        <th>
                        </th>
                    </tr>
                </table>
                {/foreach}
                <br><br>
            </div>
            {/empty}
        </div>
        <!--我的评价-->
        <div id="my_evaluate" style="display: none">
            {empty name="evaluate"}
            <div style="width: 70%;height: 567px">
                <br><br><br><br><br><br><br><br><br><br>
                <h1 style="color: gray">您还未给商品进行过评价</h1>
            </div>
            {else/}
            <div style="width: 70%;height: 567px">
                <table style="font-size: 12px">
                    <tr>
                        <th></th>
                        <th>商品名称</th>
                        <th>评价时间</th>
                        <th>评价内容</th>
                        <th></th>
                    </tr>
                    {foreach $evaluate as $e}
                    <tr>
                        <th>
                            <a target="_blank" style="color: gray" href="/index/shop?goods_id={$e['e_goods_id']}">
                                <img src="{$e['goods_img']}" width="100%">
                            </a>
                        </th>
                        <th>
                            <a target="_blank" style="color: gray" href="/index/shop?goods_id={$e['e_goods_id']}">
                                {$e['goods_name']}
                            </a>
                        </th>
                        <th>
                            <a target="_blank" style="color: gray" href="/index/shop?goods_id={$e['e_goods_id']}">
                                {$e['create_time']}
                            </a>
                        </th>
                        <th>
                            <a target="_blank" style="color: gray" href="/index/shop?goods_id={$e['e_goods_id']}">
                                {$e['e_content']}
                            </a>
                        </th>
                        <th>
                            <form action="/index/index/del_evaluate" method="post">
                                <input class="a-upload" type="submit" value="删除评价" style="height: 30px;"
                                       onclick="if (confirm('确认删除该条评价？')==false)return false;">
                                <input hidden name="e_id" value="{$e['id']}">
                            </form>
                        </th>
                    </tr>
                    <tr style="height: 30px;">
                        <th><hr></th>
                        <th><hr></th>
                        <th><hr></th>
                        <th><hr></th>
                        <th><hr></th>
                    </tr>
                    {/foreach}
                </table>
            </div>
            {/empty}
        </div>
        <!--收藏夹-->
        <div id="my_collect" style="display: none">
            {empty name="collect"}
            <div style="width: 70%;height: 567px">
                <br><br><br><br><br><br><br><br><br><br>
                <h1 style="color: gray">您的收藏夹是空的</h1>
            </div>
            {else/}
            <div style="width: 70%;height: 567px">
                <!--店铺-->
                <table>
                    <tr><td>关注的店铺</td></tr>
                    {foreach $collect as $c}
                    <tr>
                        {eq name=":$c['type']" value='0'}
                            <th>
                                <a target="_blank" href="/index/merchant?merchant={$c['name']}">
                                <img src="{$c['head_img']}" width="50%">
                                </a>
                            </th>
                            <th>
                                <a href="/index/merchant?merchant={$c['name']}">
                                    {$c['name']}
                                </a>
                            </th>
                            <th>
                                <a onclick="if (confirm('确定取消关注？')==false)return false;" style="color: gold" href="/index/index/del_collect?id={$c['id']}">
                                    取消关注
                                </a>
                            </th>
                    </tr>
                    <tr style="height: 30px;">
                        <th><hr></th>
                        <th><hr></th>
                        <th><hr></th>
                    </tr>
                    {/eq}
                    {/foreach}
                    <tr><td>收藏的商品</td></tr>
                    <!--商品-->
                    {foreach $collect as $c}
                    <tr>
                        {eq name=":$c['type']" value='1'}
                            <th>
                                <a target="_blank" href="/index/shop?goods_id={$c['num_id']}">
                                    <img src="{$c['head_img']}" width="50%">
                                </a>
                            </th>
                            <th>
                                <a href="/index/shop?goods_id={$c['num_id']}">
                                    {$c['name']}
                                </a>
                            </th>
                            <th>
                                <a onclick="if (confirm('确定取消收藏？')==false)return false;" style="color: gold" href="/index/index/del_collect?id={$c['id']}">
                                    取消收藏
                                </a>
                            </th>
                    </tr>
                    <tr style="height: 30px;">
                        <th><hr></th>
                        <th><hr></th>
                        <th><hr></th>
                    </tr>
                    {/eq}
                    {/foreach}
                </table>
            </div>
            {/empty}
        </div>
        <!--购物车-->
        <div id="my_shop_car" style="display: none">
            {empty name="shop_car"}
            <div style="width: 70%;height: 567px">
                <br><br><br><br><br><br><br><br><br><br>
                <h1 style="color: gray">您的购物车还是空的</h1>
            </div>
            {else/}
            <div style="width: 70%;height: 567px">
                <table style="font-size: 12px;">
                    <tr>
                        <th style="height: 40px"></th>
                        <th>商品名称</th>
                        <th>商品价格</th>
                        <th>商品简介</th>
                        <th>件数</th>
                        <th style="width: 3%">
                            <input onclick="all_select()" style="height: 30px" class="a-upload" type="submit" value="全选">
                        </th>
                    </tr>
                    {foreach $shop_car as $s}
                    <tr>
                        <th><img src="{$s['goods_img']}" width="100%"></th>
                        <th>
                            <a target="_blank" href="/index/shop?goods_id={$s['goods_id']}">
                                {$s['goods_name']}
                            </a>
                        </th>
                        <th>
                            <a target="_blank" href="/index/shop?goods_id={$s['goods_id']}">
                                {$s['goods_price']}
                            </a>
                        </th>
                        <th>
                            <a target="_blank" href="/index/shop?goods_id={$s['goods_id']}">
                                {$s['goods_describe']}
                            </a>
                        </th>
                        <th>
                            <input onclick="check()" class="a-upload" type="number" value="{$s['num']}"
                                   id="goods_num" name="goods_num" style="width: 30%;text-align: center" min="1">
                            <br><br>
                        </th>
                        <th style="width: 3%">
                            <input onclick="check()" name="shopping" type="checkbox"
                                   value="{$s['id']},{$s['goods_id']}">
                        </th>
                    </tr>
                    <tr style="height: 30px;">
                        <th><hr></th>
                        <th><hr></th>
                        <th><hr></th>
                        <th><hr></th>
                        <th><hr></th>
                        <th style="width: 3%"><hr></th>
                    </tr>
                    {/foreach}
                </table>
            </div>
            <div id="buy_del" style="position: fixed;top: 485px;left: 82%;display: none">
                <form action="/index/index/shop_car" method="post">
                    <input style="width: 60%;height: 50px;background: #FF623D;color: black" name='flag' type="submit"
                           onclick="javascript:if(confirm('确认购买选中的商品？')==false)return false;" class="a-upload" value="结算选中的商品">
                    <input style="width: 60%;height: 50px" name='flag' type="submit"
                           onclick="javascript:if(confirm('确认删除选中的商品？')==false)return false;" class="a-upload" value="删除选中的商品">
                    <input id="shop_data" hidden value="[]" name="shop_data">
                </form>
            </div>
            {/empty}
        </div>
    </div>
</div>
<script>
    var var_info = document.getElementById('my_info');
    var var_order = document.getElementById('my_order');
    var var_coupon = document.getElementById('my_coupon');
    var var_evaluate = document.getElementById('my_evaluate');
    var var_collect = document.getElementById('my_collect');
    var var_shop_car = document.getElementById('my_shop_car');
    var info = document.getElementById('info');
    var order = document.getElementById('order');
    var coupon = document.getElementById('coupon');
    var evaluate = document.getElementById('evaluate');
    var my_info2 = document.getElementById('my_info2');
    var collect = document.getElementById('collect');
    var shop_car = document.getElementById('shop_car');

    function all_select() {
        var shopping = document.getElementsByName('shopping');
        //判断是否已经全选
        var z = 0;
        for (var i=0;i<shopping.length;i++){
            if (shopping[i].checked){
                z++;
            }
        }
        if (z==shopping.length){
            //已经全选
            for (var j=0;j<shopping.length;j++){
                shopping[j].checked = false;
                check();
            }
        }else{
            //还未全选
            for (var p=0;p<shopping.length;p++){
                shopping[p].checked = true;
                check();
            }
        }
    }
    function check() {
        var goods_num = document.getElementsByName('goods_num');
        var shopping = document.getElementsByName('shopping');
        var buy_del = document.getElementById('buy_del');
        var shop_data = document.getElementById('shop_data');
        var shop_array = new Array();
        var array = new Array();
        var j=0;
        var z=0;
        for (var i=0;i<shopping.length;i++){
            if (shopping[i].checked){
                j=1;
                array=shopping[i].value+','+goods_num[i].value;
                shop_array[z] = array;
                z++;
            }
        }
        if (j==1){
            buy_del.style.display = '';
        }else{
            buy_del.style.display = 'none';
        }
        shop_data.value = shop_array;
    }
    function my_info(){
        var_info.style.display = 'block';
        var_order.style.display = 'none';
        var_coupon.style.display = 'none';
        var_evaluate.style.display = 'none';
        info.style.fontSize = '30px';
        order.style.fontSize = '';
        var_collect.style.display = 'none';
        collect.style.fontSize = '';
        var_shop_car.style.display = 'none';
        shop_car.style.fontSize = '';
        coupon.style.fontSize = '';
        my_info2.style.display = 'none';
        evaluate.style.fontSize = '';
    }
    function my_order(){
        var_info.style.display = 'none';
        var_order.style.display = 'block';
        var_coupon.style.display = 'none';
        var_evaluate.style.display = 'none';
        info.style.fontSize = '';
        order.style.fontSize = '30px';
        var_collect.style.display = 'none';
        collect.style.fontSize = '';
        coupon.style.fontSize = '';
        my_info2.style.display = 'none';
        evaluate.style.fontSize = '';
        var_shop_car.style.display = 'none';
        shop_car.style.fontSize = '';
    }
    function my_coupon(){
        var_info.style.display = 'none';
        var_order.style.display = 'none';
        var_coupon.style.display = 'block';
        var_evaluate.style.display = 'none';
        info.style.fontSize = '';
        order.style.fontSize = '';
        var_collect.style.display = 'none';
        collect.style.fontSize = '';
        my_info2.style.display = 'none';
        coupon.style.fontSize = '30px';
        evaluate.style.fontSize = '';
        var_shop_car.style.display = 'none';
        shop_car.style.fontSize = '';
    }
    function my_evaluate(){
        var_info.style.display = 'none';
        var_order.style.display = 'none';
        var_coupon.style.display = 'none';
        var_evaluate.style.display = 'block';
        info.style.fontSize = '';
        order.style.fontSize = '';
        var_collect.style.display = 'none';
        collect.style.fontSize = '';
        coupon.style.fontSize = '';
        my_info2.style.display = 'none';
        evaluate.style.fontSize = '30px';
        var_shop_car.style.display = 'none';
        shop_car.style.fontSize = '';
    }
    function my_collect(){
        var_info.style.display = 'none';
        var_order.style.display = 'none';
        var_coupon.style.display = 'none';
        var_evaluate.style.display = 'none';
        var_collect.style.display = 'block';
        collect.style.fontSize = '30px';
        info.style.fontSize = '';
        order.style.fontSize = '';
        coupon.style.fontSize = '';
        my_info2.style.display = 'none';
        evaluate.style.fontSize = '';
        var_shop_car.style.display = 'none';
        shop_car.style.fontSize = '';
    }
    function my_shop_car() {
        var_info.style.display = 'none';
        var_order.style.display = 'none';
        var_coupon.style.display = 'none';
        var_evaluate.style.display = 'none';
        var_collect.style.display = 'none';
        collect.style.fontSize = '';
        info.style.fontSize = '';
        order.style.fontSize = '';
        coupon.style.fontSize = '';
        my_info2.style.display = 'none';
        evaluate.style.fontSize = '';
        var_shop_car.style.display = 'block';
        shop_car.style.fontSize = '30px';
    }
    function showUp(){
        my_info2.style.display = '';
        var_info.style.display = 'none';
    }
    function info_back(){
        my_info2.style.display = 'none';
        var_info.style.display = '';
    }
    function showImg(input) {
        var file = input.files[0];
        var reader = new FileReader();
        // 图片读取成功回调函数
        reader.onload = function(e) {
            document.getElementById('upload').src=e.target.result
        };
        reader.readAsDataURL(file)
    }
</script>
{/block}